<template>
	<view class="order">
		<view class="navbar">
			<view class="navbar-title">
				<u-icon size="32rpx" name="arrow-left" @click="showModel" />
				<text>确认订单</text>
				<text></text>
			</view>
		</view>
		<film-info :msg="msg"></film-info>
		<order-pay :channelOrderCode='channelOrderCode' :orderCode="orderCode" :enterNum='enterNum'
			:isRelease="isRelease"></order-pay>
		<view class="tips">
			<view class="tips-title">
				<text>购票须知</text>
			</view>
			<view class="read-text">
				<text>{{buyTicketNotice.replace(/\\n/g,'\n')}}</text>
			</view>
		</view>
	</view>
</template>

<script>
	import FilmInfo from '../../components/orderInfo/FilmInfo.vue'
	import OrderPay from '../../components/orderInfo/OrderPay.vue'
	export default {
		components: {
			FilmInfo,
			OrderPay
		},
		data() {
			return {
				channelOrderCode: '',
				orderCode: '',
				isRelease: false,
				timer: null,
				msg: '10:00',
				maxTime: 600,
				buyTicketNotice: '',
				enterNum: 0
			};
		},
		onLoad(options) {
			this.channelOrderCode = options.channelOrderCode
			this.orderCode = options.orderCode
			this.timer = setInterval(() => {
				this.maxTime--;
				this.getTime()
			}, 1000)
			uni.setNavigationBarTitle({
				title: this.$store.state.cinemaName
			})
			this.buyTicketNotice = this.$store.state.cinemaConfig.buyTicketNotice;
		},
		onShow() {
			this.enterNum++
		},
		methods: {
			showModel() {
				uni.showModal({
					confirmText: "确定",
					title: '温馨提示',
					content: '返回后您当前选择的座位将不再保留',
					success: res => {
						uni.navigateBack({
							delta: 1
						})
					}
				})
			},
			getTime() {
				if (this.maxTime >= 0) {
					let minutes = Math.floor(this.maxTime / 60);
					let seconds = Math.floor(this.maxTime % 60);
					this.msg = minutes + ":" + seconds;
				} else {
					this.isRelease = true
					clearInterval(this.timer);
				}
			}
		}

	}
</script>

<style lang="scss">
	.order {
		background-color: #f0f0f5;
		padding-bottom: 230rpx;

		.navbar {
			width: 100vw;
			height: 10vh;
			display: flex;
			justify-content: center;

			background-color: #fff;
			position: fixed;
			top: 0;

			.navbar-title {
				margin-top: 6vh;
				display: flex;
				justify-content: space-between;
				align-items: center;
				width: 95%;
				padding: 0 20rpx;
			}

		}

		.tips {
			background-color: #fff;
			margin-top: 15rpx;

			.tips-title {
				width: 92vw;
				border-bottom: 1px solid #f0f0f5;
				margin: auto;

				text {
					font-size: 26rpx;
					width: 92vw;

					line-height: 80rpx;
				}
			}

			.read-text {
				width: 92vw;
				margin: auto;
				color: #999;

				text {
					font-size: 24rpx;
					width: 92vw;
					display: block;
					line-height: 50rpx;
				}
			}
		}
	}
</style>